<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>菜鸟教程(runoob.com)</title>
    <script src="../js/vue.min.js"></script>
</head>
<body>
<body id="demo">
<div v-my-directive="a"></div>
<button @click="change">change</button>{{a,b,c}}
</body>
<script>
    Vue.directive('my-directive',function(){
        deep : true,

                update : function(obj){
            //当obj的嵌套属性变化时候调用
            console.info(obj.b.c);
        }
    })
    var demoVM = new Vue({
        el : '#demo',

        data : {
            a : {b : {c : 2}}
        },

        method : {
            change : function(){
                demoVM.a.b.c = 4;
            }
        }
    })
</script>
</body>
</html>

